<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form labels="上传文件" id="uploadForm" onsubmit="upload(event)" >
        <input type="file" id="fileInput" name="file" required>
        <input type="submit"></input>
    </form>
    <button onclick="xiazai()">下载</button>
    <div id="response"></div>

    <script>
        // document.getElementById('uploadForm').addEventListener('submit', async function(event) {
        //     event.preventDefault(); // 阻止表单默认提交
        //     const fileInput = document.getElementById('fileInput');
        //     const formData = new FormData();
        //     formData.append('file', fileInput.files[0]); // 将文件添加到 FormData 对象
        //     console.log(formData);
        //     fetch('http://localhost:3000/upload',{
        //         method:'post',
        //         body:formData
        //     }).then((response) => response.json())
        //     .then((data) => {
        //         console.log(data);
        //     })
            
        // });

        class m {
            constructor(a,b){
                this.a = a;
                this.b = b;
            }
        }

        class n extends m{
            constructor(a,b,c){
                super(a,b);
                this.c = c;
            }
        }
        let obj = new n(1,2,3);
        console.log(obj);
        
        function xiazai(){
            fetch('http://localhost:3000/upload/download?url=zjz.jpg',{
                method:'get',
            }).then(async res=>{
                const reader = res.body.getReader();
                const chunks = [];
                let result;

                // 读取流
                while (!(result = await reader.read()).done) {
                    chunks.push(result.value);
                }

                // 将 chunks 转换为 Blob
                const blob = new Blob(chunks,{ type: 'image/jpeg' });
                // 生成下载连接
                const url = URL.createObjectURL(blob);

                // 创建一个隐藏的 <a> 标签进行下载
                const a = document.createElement('a');
                a.href = url;
                a.download = 'downloaded_file'; // 设置下载文件的名称

                // 触发点击事件
                document.body.appendChild(a);
                a.click();

                // 清理
                document.body.removeChild(a);
                URL.revokeObjectURL(url); // 释放 Blob URL
                
            })
        }
        function upload(event){
            event.preventDefault();
            
            const fileInput = document.getElementById('fileInput');
            const formData = new FormData();
            formData.append('file', fileInput.files[0]); // 将文件添加到 FormData 对象
            console.log(formData);
            fetch('http://localhost:3000/upload',{
                method:'post',
                body:formData
            }).then((response) => response.json())
            .then((data) => {
                console.log(data);
            })
        }
    </script>
</body>
</html>